<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>报名页</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <link rel="stylesheet" href="libs/l7/light7.min.css">
    <link rel="stylesheet" href="Content/common.css">
    <link rel="stylesheet" type="text/css" href="Content/enroll.css"/>
</head>

<body>
    <!-- 你的html代码 -->
    <div class="page" id="app">
        <nav class="bar bar-tab">
            <a class="tab-item active" href="#">
                <span class="icon">
                    <img src="Images/home_active.png"/>
                </span>
                <span class="tab-label">首页</span>
            </a>
            <a class="tab-item" href="#">
                <span class="icon">
                    <img src="Images/enroll.png"/>
                </span>
                <span class="tab-label">我要报名</span>
            </a>
            <a class="tab-item" href="#">
                <span class="icon">
                    <img src="Images/rank.png"/>
                </span>
                <span class="tab-label">排行榜</span>
            </a>
            <a class="tab-item" href="#">
                <span class="icon">
                    <img src="Images/rule.png"/>
                </span>
                <span class="tab-label">活动规则</span>
            </a>
        </nav>
        <div class="content">
            <!-- 这里是页面内容区 -->
            <!--banner-->
            <div class="er-banner">
            	<img src="" alt="" />
            </div>
            <!--searchBar-->
            <div class="er-search">
            	<input class="er-searchBar" type="text" placeholder="请输入参赛者姓名或编号">
            	<div class="er-searchBtn">
            		搜索
            	</div>
            </div>
            <div class="er-bolang"></div>
            <!--main边框-->
            <div class="er-main">
            	<div class="erM-title">
            		参赛报名处
            	</div>
            	<div class="erM-tip">
            		注意：一个微信号只能报名一次
            	</div>
            	<div class="erM-name erM-card">
            		<span>*</span> 姓名 <input type="text" placeholder="请输入您的姓名" />
            	</div>
            	<div class="erM-phone erM-card">
            		<span>*</span> 姓名 <input type="text" placeholder="请输入您的手机号码" />
            	</div>
            	<div class="erM-photo erM-card">
            		<span>*</span> 参赛照片 (最多三张)
            		<div class="erM-upPic">
            			<div class="erM-up">
            				<span class="erM-plus">+</span>
	            		</div>
	            		<div class="erM-up">
	            			<span class="erM-minus"><img src="Images/del.png"/></span>
	            		</div>
	            		<div class="erM-up">
	            			<span class="erM-minus"><img src="Images/del.png"/></span>
	            		</div>
            		</div>           		
            	</div>
            	<div class="erM-info erM-card">
            		参赛宣言           		
            		<textarea name="" rows="" cols="" placeholder="" ></textarea>
            		<span id="infoLimit">
            			<span class="nowNum">0</span>/40
            		</span>
            	</div>
            	<div class="erM-btn">
            		<div class="erM-submit">
            			提交报名
            		</div>
            		<div class="erM-seeMore">
            			看看别人的照片
            		</div>
            	</div>
            	<div class="erM-card erM-line"></div>
            	<div class="erM-card erM-icon">
            		<img src="Images/PetIn_logo.png" class="logo"/>
            		<img src="Images/petin_qrcode.png" class="qrcode"/>
            	</div>
            	<div class="erM-tip2">
            		<span></span>
            		<p>长按或扫描，了解更多活动</p>
            		<span></span>
            	</div>          
            </div>
            <div class="er-sucDiv">
            	 <div class="er-suc">
            	 	<img src="Images/close.png" class="closeThis"/>
	            	<img src="Images/success.png" alt="" />
	            	<p>报名成功</p>
	            	<p>恭喜您报名成功啦！</p>
	            </div>
            </div>
           
        </div>
    </div>
    <script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script>
    <script type='text/javascript' src='libs/l7/light7.min.js' charset='utf-8'></script>
    <script src="https://cdn.jsdelivr.net/npm/vue"></script>
    <script type="text/javascript">
    	var app=new Vue({
    		
    		
    		
    	});
    </script>
</body>

</html>